
#topBar,#navBar,#banner,#main,#footer{
	   width: 100%; /*设置通栏div的宽为浏览器窗口的宽*/
       min-width: 1200px;/*设置通栏div最小宽度为1200px*/
}
/*清除浮动*/
#footer .center:after,#navBar .menuList:after,#main .list:after,.video .content:after{
	content: "";
	display: block;
	clear: both;
}

#topBar .center{
       width: 1000px;   /*设置内层div的宽为1000px*/
       height: 90px;	 /*设置内层div的高为90px*/
       margin: 0 auto;  /*设置内层div在父容器中左右居中显示*/
} 

#topBar .center .left{
    float: left;
    display: block;   /*设置a标签为块元素*/
    height: 100%;
 }
#topBar .center img{height: 90px;  }
#topBar .center .right{
    float: right;
    height: 100%;
    line-height: 90px;   /*设置行高为90px*/}
#topBar .center a{font-size: 16px; margin-right: 15px;}
#topBar .center i{font-size: 20px; color: #00bcd4;margin-right: 5px; }


/*导航菜单栏*/
#navBar{
   		background-color: rgba(255,255,255,0.5); /*背景为白色半透明*/
   		/*opacity: 0.5;*/
		position: absolute;
		top: 90px;
		left: 0;
		z-index: 10;
}
#navBar .center{ 
		width: 1000px;
		height: 50px;
		margin: 0 auto;
		line-height: 50px; 
}
#navBar .liLeft{
		position: relative;
		float: left;   /*设置li左浮动*/}
#navBar .liLeft .menu{
	    display: block;   /*设置a为块元素*/
	    height: 100%;
	    padding: 0 36px;   /*设置左右内边距各为36px*/
	    color: #363636;
	    font-weight: bold;  /* 设置字体为粗体*/
	    font-size: 18px;
}
/*鼠标悬停一级菜单背景*/
/*#navBar .liLeft .menu:hover{
	background-color: rgba(255,255,255,0.9);
}*/
/*鼠标悬停一级菜单显示二级菜单*/
/*#navBar .liLeft .menu:hover + .menuList{
	display: block;
}*/
/*鼠标悬停二级菜单,二级菜单显示*/
/*#navBar .liLeft .menuList:hover{
	display: block;
}*/
/*#navBar .liLeft:hover .menu{
	background-color: rgba(255,255,255,0.9);
} 
#navBar .liLeft:hover .menuList{
	display: block;
} */

/*导航栏二级菜单*/

#navBar .menuList{
	display: none;   /*设置元素隐藏*/
	position: absolute;  /*设置二级菜单的div为绝对定位*/
	top: 50px;
	width: 580px;
	padding: 20px;  /*设置该盒子上下左右的内边距各为20px*/
	box-sizing: border-box;  /*设置该div盒子尺寸大小作用范围为边框*/
	background-color:rgba(255,255,255,0.9);
}

#navBar .rightAlign{
	left: -436px;
}
#navBar .menuList .ulList{
	float: left;    
	list-style: disc;  /*设置列表符号类型为实心圆*/
	font-size: 12px;
	list-style-position: inside;	/*设置列表符号的位置在文本内*/
}

#navBar .menuList .ulList li{
	line-height: 26px;	  /*设置li的行高为26px*/
}
#navBar .menuList .account{
	float: right;
	padding-left: 220px;/*使文字距离该div左侧220px，距离背景图片右侧20px*/
	background-position: left center; /*图片位置：居左、上下居中*/
	background-size: 200px auto;  /*图片大小：宽200px、高度auto不固定*/
	background-repeat: no-repeat;  /*背景图片不重复显示*/
	
}
#navBar .menuList  .img1{
	background-image: url(../img/img1.jpg);
}
#navBar .menuList  .img2{
	background-image: url(../img/img2.JPG);
}
#navBar .menuList  .img3{
	background-image: url(../img/img3.JPG);
}
#navBar .menuList  .img4{
	background-image: url(../img/img4.JPG);
}
#navBar .menuList  .img5{
	background-image: url(../img/img5.JPG);
}
#navBar .menuList .img6{
	background-image: url(../img/img6.JPG);
}
#navBar .menuList .account p{
	width: 200px;
	font-size: 12px;
	line-height: 20px;
}
#navBar .menuList .account a{
	color: blue;   /*设置超文本"详情"的字体颜色为蓝色*/
}

/*轮播图*/
#banner{
   		height: 330px;
   		position: relative;
}

#banner .bg {
	width:100%;
	height: 100%;
	position: relative;
}
#banner .bg li{
	width: 100%;
	height: 330px;
	position: absolute;
	top: 0;
	left: 0;
	animation: autoPlay 12s infinite;
}
#banner .bg li:nth-of-type(2){
	animation-delay: 4s;
}
#banner .bg li:nth-of-type(3){
	animation-delay: 8s;
}


#banner .bg img{
	width: 100%;
	height: 330px;
}
.tab{
	width: 100px;
	position: absolute;
	bottom: 12px; /* 切换按钮距离底部12px*/
	left: 50%;
	margin-left: -50px;
	z-index:5 ;
	
}

.tab span{
	display: inline-block;  /*设置span元素为行内块元素*/
	width: 14px;
	height: 14px;
	border-radius: 50%;   /*设置圆角为50%*/
	background-color: white;
	cursor: pointer;   /*设置光标形状为小手*/  
	margin-right: 15px;	
}
.banTab span{
	animation: changeColor 12s infinite;
}
.banTab span:nth-of-type(2){
	animation-delay: 4s;
}
.banTab span:nth-of-type(3){
	animation-delay: 8s;
}
#banner:hover li,#banner:hover span{
	animation-play-state: paused;
}

@keyframes autoPlay{
	0%,33%{
		z-index: 3;
		opacity: 1;
	}
	43%,100%{
		z-index: 1;
		opacity: 0;
	}
}
@keyframes changeColor{
	0%,33%{
		background-color: #ff7600;
	}
	43%,100%{
		background-color: #fff;
	}
}


/*固定导航栏*/
#fixBar{
    background-color: #636363;
    width: 75px;
    position: fixed;  /*设置其为固定定位*/
    top: 50%;
    margin-top: -150px;
    left: 0;
    z-index: 20;
}
#fixBar li a{
	display: block;
	width: 100%;
	line-height: 30px;
	text-align: center;
	border-bottom: 1px dashed #b2b2b2;
	color: white;
}
#fixBar li a:hover{
	background-color: #ff7600;
}



/*主体区域*/

#main{
	background-color: #F6F6F6;
}
#main .center{
	width: 1000px;
	margin: 0 auto;
	/*background-color: darkgray;*/
	padding-bottom: 20px;
	
}

/*公告*/
.notice{
	height:40px ;
	line-height: 40px;
	position: relative;
	overflow: hidden;	/*溢出隐藏*/
}
.notice .noticeList{
	position: absolute;
	left: 30px;
	top: 0px;}
.icon-gengduo1{
	position: absolute;
	right: 0;
	font-size: 12px !important;
	color: #9a9a9a;
	}
@keyframes moveup{
	0%,20%{top: 0;}
	25%,45%{top: -40px;}
	50%,70%{top: -80px;}
	75%,100%{top: -120px;}
}
.notice .noticeList{animation: moveup 16s infinite;}
.notice .noticeList:hover{animation-play-state: paused;}


/*最新动态,新闻列表*/
#main .list{
	width: 100%;
	/*background-color: white;*/	
}


/*最新动态*/
.dynamic{
	width: 490px;
	/*height: 200px;*/
	/*background-color: blanchedalmond;*/
	float: left;
}
/*动态、 新闻、 视频、 风采图片背景样式、标题和文字列表样式*/
.bgStyle{
	padding: 20px;   /*设置背景边框与中间内容上下左右有20px的距离*/
	box-sizing: border-box;  /*设置width作用到边框*/
	background-color: white;
	border-radius: 4px;   
	border: 1px solid lightgrey;
    box-shadow: 0 0 4px #d8d8d8; 
}
.title{
	position: relative;
	padding:0 0 10px 10px;  /*设置标题区的下内边距和左内边距都为10px*/
	border-bottom: 3px solid #035b60;
}
.title span{
	cursor: pointer;
	color: #363636;
	font-weight: bold;
}
.content{
	margin-top: 15px; /*设置内容区域与标题之间有15px的距离*/
}
.newsList li{
	height: 34px;
	line-height: 34px;
	background: url(../img/page_n.gif) left center no-repeat;
	padding-left: 20px;  /*使文字和列表左侧有20px的距离*/
}
.newsList li a:hover{
	color: #ff7600;
	text-decoration: underline;/*当鼠标悬停时，为文本添加下划线*/
}
.newsList li span{
	float: right;
	color: #9a9a9a;
	font-size: 14px;
}
/*轮播图*/
.dynamic .banner{
	width: 340px;   
	height: 194px;
	margin: 0 auto;  /* 水平居中显示*/
	margin-bottom: 10px;  /*设置轮播图与新闻列表之间有10px的距离*/
	position: relative;   /*相对定位*/
	overflow: hidden;  /*溢出隐藏*/
}
.dynamic .banner .bg{
	/*width: 1020px;*/
	height: 100%;
	position: absolute;  /*轮播图所在的ul绝对定位*/
	left: 0;
	/*animation: moveleft 12s infinite;*/
}
.dynamic .banner .bg li{
	width: 340px;
	height: 100%;
	float: left;  /* li左浮动,使图片在一行显示*/
}
.dynamic .banner .bg img{
	width: 100%;  /*图片的宽为340px*/
	height: 100%; /*图片的高为194px*/
}
/*调用动画,在大banner中已定义*/
.dynTab span{
	/*animation: changeColor 12s infinite;*/
}
/*.dynTab span:nth-of-type(2){
	animation-delay:4s ;
}
.dynTab span:nth-of-type(3){
	animation-delay:8s ;
}*/
@keyframes moveleft{
	0%,30%{
		left: 0;
	}
	35%,65%{
		left: -340px;
	}
	70%,100%{
		left: -680px;
	}
}

/*鼠标悬停时,停止播放*/
/*.dynamic .banner:hover .bg,.dynamic .banner:hover span{
	animation-play-state: paused;
}*/



/*新闻列表*/
#main .news{
	width: 490px;
	/*height: 200px;*/
	/*background-color: blanchedalmond;*/
	float: right;
}
.news i{
	font-style: normal;  /* 使‘|’的字体正常显示，而不是斜体 */
	margin: 0 5px;  /*距离左右各有5px的距离*/
}


/*视频*/
#main .video{
	width: 100%;
	/*height: 200px;*/
	/*background-color: white;*/
	margin: 20px 0;
	
}

.video .left{
	float: left;}
.video .right{
	float: right;
	width: 448px;}


/*图片风采*/
#main .imgList{
	width: 100%;
	/*height: 200px;*/
	/*background-color: white;*/
	
}
.imgList .h{
	height: 200px;
	position: relative;
}
.imgList .icon-lunbozuofangun,.imgList .icon-lunboyoufangun{
	width: 30px;
	height: 100%;
	background-color: #424242;
	text-align: center;  /*字体图标水平居中*/
	line-height: 200px;  /*字体图标垂直居中*/
	font-size: 26px !important;  /*字体图标大小为26px*/
	color:#b7b7b7 ;	
	opacity: 0.5;   /*图标和背景都半透明*/
	position: absolute;    /*绝对定位*/
	cursor: pointer;  /*鼠标悬停显示为小手形状*/
}
.imgList .icon-lunbozuofangun{
	left: 0;  /*左翻滚居左显示*/
}
.imgList .icon-lunboyoufangun{
	right: 0;  /*右翻滚居右显示*/
}
.imgList .item{
	width: 880px;
	height: 100%;
	position: absolute;
	left: 39px;
	overflow: hidden;   /*超出的内容隐藏*/
}
.imgList ul{
	width: 1350px;  
	height: 100%;
	position: absolute;
	left: 0px;
	/*animation: moveImg 10s linear infinite;*/
}
.imgList  li{
	float: left;
	width:205px;
	height: 100%;
	position: relative;  /*每个li相对定位*/
	margin-right: 20px;
}
.imgList img{
	width:100%;
	height: 100%;
}
.imgList .hidden{
	position: absolute;  
    top: 0px;
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,0.7);
    padding: 37px;
    box-sizing: border-box;
    display: none;
}
.imgList .hidden p{  
	color: white;
    line-height: 26px;  /*行间距为26px*/
    text-align: center;  /*水平居中显示*/
    font-size: 14px;
}
.imgList .hidden a{
    display: block;
    width: 130px;
    height: 30px;
    margin-top: 15px;
    background-image: url(../img/pl_bg.png);  /*设置背景图片,默认平铺*/
    opacity: 0.9;  /*背景透明度为0.9*/
    text-align: center;  /*文字水平居中*/
    line-height: 30px;  /* 文字垂直居中*/
    font-size: 14px;
    color: #fff ;
}
/*鼠标悬停显示图片信息*/
.imgList  li:hover .hidden{
	display: block;
}

/*底部*/
#footer{
	background-color: white;
	
}
#footer .center{
	width: 1000px;
	/*height: 60px;*/
	margin: 0 auto;
	padding: 20px 0;
	/*background-color: white;*/
}


#footer .center dl{
	width: 250px;
	float: left;
	padding-right: 30px;
	box-sizing: border-box;
}
#footer .center dt a{
	line-height: 24px; /*设置行高为24px*/
}
#footer .center dd a{
	line-height: 22px;
	font-size: 14px;
	color: gray;
}
/*版权*/
#footer .copyright{
	width: 100%;
	line-height: 50px;
	text-align: center;
	background-color: #252525;
	font-size: 14px;
	color: white;   
}
